import 'package:extended_image/extended_image.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:hive/hive.dart';
import 'package:sprintf/sprintf.dart';
import 'MinePage.dart';
import 'model/data.dart';

class OrderPage extends StatefulWidget {
  final int index;

  OrderPage(this.index);

  @override
  State<OrderPage> createState() => _OrderPageState();
}

class _OrderPageState extends State<OrderPage>
    with SingleTickerProviderStateMixin {
  late TabController _controller;

  List<Order> _list = [];

  @override
  void initState() {
    super.initState();

    _controller = TabController(length: titles.length, vsync: this);
    _controller.animateTo(widget.index);

    _loadData();
  }

  void _loadData() {
    var box = Hive.box('box');
    _list = List<Order>.from(box.get('order', defaultValue: <dynamic>[]));
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
        length: titles.length,
        child: Scaffold(
          appBar: AppBar(
            bottom: TabBar(
              controller: _controller,
              indicatorSize: TabBarIndicatorSize.label,
              tabs: [
                for (int i = 0; i < titles.length; i++)
                  Tab(
                    icon: Image.asset(
                      "images/${icons[i]}.png",
                      width: 20,
                      color: Colors.white,
                    ),
                    text: titles[i],
                  )
              ],
            ),
            title: Text('我的订单'),
          ),
          body: TabBarView(
            controller: _controller,
            children: [
              _list.isEmpty
                  ? Center(
                  child: Image.asset(
                    "images/ee.png",
                    width: 150,
                  ))
                  : ListView(
                padding:
                const EdgeInsets.symmetric(horizontal: 15, vertical: 10),
                children: _list.map((e) => _itemWidget(e)).toList(),
              ),
              Center(
                  child: Image.asset(
                    "images/ee.png",
                    width: 150,
                  )),
              Center(
                  child: Image.asset(
                    "images/ee.png",
                    width: 150,
                  )),
              Center(
                  child: Image.asset(
                    "images/ee.png",
                    width: 150,
                  )),
            ],
          ),
        ));
  }

  Widget _itemWidget(Order device) {
    double price = double.parse(device.price) / 100.0;

    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 15,vertical: 10),
      margin: const EdgeInsets.symmetric(vertical: 8),
      decoration: BoxDecoration(
          color: Colors.white, borderRadius: BorderRadius.circular(15)),
      child: Column(
        children: [
          Row(
            children: [
              Container(
                  decoration: BoxDecoration(
                      border: Border.all(color: Colors.grey.shade200)),
                  child: ExtendedImage.network(
                    "http://cdn.wfhero.online/device/${device.pic}.jpg",
                    width: 80,
                    height: 80,
                  )),
              const SizedBox(
                width: 15,
              ),
              Expanded(
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      SizedBox(
                          height: 50,
                          child: Text(
                            device.name,
                            maxLines: 2,
                            style: const TextStyle(fontWeight: FontWeight.w600),
                          )),
                      Row(
                        children: [
                          Text(
                            sprintf("￥%.2f/天", [price]),
                            style: const TextStyle(color: Colors.red),
                          ),
                        ],
                      )
                    ],
                  ))
            ],
          ),
          const SizedBox(height: 20,),
          Row(
            children: [
              Text("租用时间：${device.startTime} ~ ${device.endTime}")
            ],
          ),

          const SizedBox(height: 15,),
          InkWell(
            onTap: () {
              showDialog(context: context, builder: (_){
                return CupertinoAlertDialog(
                  title: Text('提示'),
                  content:Text('确定要取消租用？'),
                  actions:<Widget>[

                    CupertinoDialogAction(
                      child: Text('关闭'),
                      onPressed: (){
                        Navigator.of(context).pop();
                      },
                    ),
                    CupertinoDialogAction(
                      child: Text('确定'),
                      onPressed: () async {
                        setState((){
                          _list.remove(device);
                        });
                        var box = Hive.box('box');
                        box.put("order", _list);
                        Navigator.of(context).pop();
                      },
                    ),
                  ],
                );
              });

            },
            child: Container(
              alignment: Alignment.bottomRight,
              child: Container(
                height: 30,
                width: 80,
                alignment: Alignment.center,
                decoration: BoxDecoration(
                    border: Border.all(color: Colors.red),
                    borderRadius: BorderRadius.circular(10)
                ),
                child: const Text("取消租用",style: TextStyle(color: Colors.redAccent,fontSize: 13),),
              ),
            ),
          )
        ],
      ),
    );
  }
}
